<%@ page import="com.party.core.model.system.TargetType" %>
<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="../include/tag.jsp" %>
<!DOCTYPE html>
<html lang="zh">
<head>
    <title>${activity == null ? '发布' : '编辑'}众筹项目</title>
    <%@include file="../include/commonFile.jsp" %>
    <link rel="stylesheet" href="${ctx}/css/common/list.css">
    <link rel="stylesheet" href="${ctx}/css/ui/activity/publish_act.css">
    <link rel="stylesheet" href="${ctx}/static/uploadCI/upload.css">
    <style type="text/css">

        .tip {
            border: 1px solid #efefef;
            border-radius: 5px;
            padding-left: 30px;
            padding-top: 10px;
            padding-bottom: 10px;
            font-size: 18px;
            color: #000000;
            letter-spacing: 1px;
            width: calc(100% - 140px);
        }

        .tip span {
            padding-left: 5px;
            padding-right: 5px;
        }
    </style>
</head>
<c:set var="copartner" value="false" scope="page"/>
<shiro:hasRole name="copartner">
    <c:set var="copartner" value="true" scope="page"/>
</shiro:hasRole>
<!--头部-->
<c:if test="${copartner == true}">
    <%@include file="../include/header.jsp" %>
</c:if>
<c:if test="${copartner == false}">
    <%@include file="../include/editHeader.jsp" %>
</c:if>
<div class="index-outside">
    <%@include file="../include/sidebar.jsp" %>
    <!--内容-->
    <section>
        <div class="section-main">
            <!-- 正文请写在这里 -->
            <div class="add-form-content">
                <form id="myForm" class="layui-form mt20" method="post"
                      action="${ctx}/activity/zcActivity/third/save.do">
                    <input type="hidden" name="isCrowdfunded" value="1"/>
                    <input type="hidden" name="eventId" value="${activity.eventId}"/>
                    <div class="layui-form-item">
                        <label class="layui-form-label"></label>
                        <div class="layui-input-block">
                            <div class="tip">权限:你可对<span class="red">1.活动标题 2.发布者 3.头像 4.海报 5.宣传口号 6.活动详情</span>进行编辑
                            </div>
                        </div>
                    </div>
                    <%--<div class="layui-form-item">
                        <label class="layui-form-label">活动标题<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="活动标题"
                                   class="layui-input" value="${activity.title}">
                            <input type="hidden" name="id" value="${activity.id}"/>
                        </div>
                    </div>--%>
                    <div class="layui-form-item">
                        <label class="layui-form-label">活动标题<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" maxlength="50" name="title" lay-verify="title" autocomplete="off"
                                   class="layui-input margin-right" value="${activity.title}"
                                   style="width: calc(100% - 110px);">
                            <div class="layui-form-mid layui-word-aux">最多50字符</div>
                            <input type="hidden" name="id" value="${activity.id}"/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">发布者<span class="f-verify-red">*</span></label>
                            <div class="layui-input-inline">
                                <c:if test="${empty activity.publisher}">
                                    <input type="text" name="publisher" lay-verify="publisher" autocomplete="off"
                                           class="layui-input" value="${sessionScope.newCurrentUser.realname}">
                                </c:if>
                                <c:if test="${not empty activity.publisher}">
                                    <input type="text" name="publisher" lay-verify="publisher" autocomplete="off"
                                           class="layui-input" value="${activity.publisher}">
                                </c:if>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">头像<span class="f-verify-red">*</span></label>
                        <div class="cover-content">
                            <c:if test="${activity == null || empty activity.publisherLogo}">
                                <input type="hidden" name="publisherLogo" id="publisherLogo" lay-verify="publisherLogo"
                                       value="${sessionScope.newCurrentUser.logo}"/>
                                <span id="logo-img" class="round-img"
                                      style="background-image:url(${sessionScope.newCurrentUser.logo})"></span>
                            </c:if>
                            <c:if test="${activity != null && not empty activity.publisherLogo}">
                                <input type="hidden" name="publisherLogo" id="publisherLogo" lay-verify="publisherLogo"
                                       value="${activity.publisherLogo}"/>
                                <span id="logo-img" class="round-img"
                                      style="background-image:url('${activity.publisherLogo}')"></span>
                            </c:if>
                            <a class="layui-btn layui-btn-danger" id="sel_logo_img">+添加头像</a>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">海报<span class="f-verify-red">*</span></label>
                        <div class="cover-content">
                            <input type="hidden" name="pic" id="pic" lay-verify="pic" value="${activity.pic}"/>
                            <c:if test="${activity == null || empty activity.pic}">
                                <span id="cover-img" class="cover-img"
                                      style="background-image:url(${ctx}/image/posterImg.png)"></span>
                            </c:if>
                            <c:if test="${activity != null && not empty activity.pic}">
                                <span id="cover-img" class="cover-img"
                                      style="background-image:url('${activity.pic}')"></span>
                            </c:if>
                            <a class="layui-btn layui-btn-danger" id="sel_pic_img">+添加海报</a>
                            <div class="form-word-aux">建议尺寸：800x450</div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">报名截止时间<span class="f-verify-red">*</span></label>
                            <div class="layui-input-inline">
                                <input class="layui-input" name="endDate" lay-verify="endDate" placeholder="报名截止时间"
                                       id="endTime" readonly
                                       value='<fmt:formatDate value="${activity.endTime}" pattern="yyyy-MM-dd HH:mm" />'
                                       disabled/>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-inline">
                            <label class="layui-form-label">活动开始时间<span class="f-verify-red">*</span></label>
                            <div class="layui-input-inline">
                                <input class="layui-input" name="startDate" lay-verify="startDate" placeholder="活动开始时间"
                                       id="startTime" readonly
                                       value='<fmt:formatDate value="${activity.startTime}" pattern="yyyy-MM-dd HH:mm" />'
                                       disabled/>
                            </div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">众筹宣言<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <textarea maxlength="100" class="layui-textarea calc-110" name="crowdDeclaration"
                                      lay-verify="crowd_xy"
                                      placeholder="请输入众筹宣言，让大家来参与报名吧！">${activity.crowdDeclaration}</textarea>
                            <div class="layui-form-mid layui-word-aux">最多100字符</div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">支持宣言<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <textarea maxlength="100" class="layui-textarea calc-110" name="supportDeclaration"
                                      lay-verify="support_xy"
                                      placeholder="请输入支持宣言，让大家支持本次活动吧！">${activity.supportDeclaration}</textarea>
                            <div class="layui-form-mid layui-word-aux">最多100字符</div>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">联合发起宣言<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <textarea maxlength="100" class="layui-textarea calc-110" name="representDeclaration"
                                      lay-verify="represent_xy"
                                      placeholder="请输入联合发起宣言，让大家来参与联合发起吧！">${activity.representDeclaration}</textarea>
                            <div class="layui-form-mid layui-word-aux">最多100字符</div>
                        </div>
                    </div>
                    <%--<div class="layui-form-item">
                        <label class="layui-form-label">众筹宣言<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="crowdDeclaration" lay-verify="crowd_xy" autocomplete="off"
                                   placeholder="众筹宣言" class="layui-input" value="${activity.crowdDeclaration}">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">支持宣言<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="supportDeclaration" lay-verify="support_xy" autocomplete="off"
                                   placeholder="支持宣言" class="layui-input" value="${activity.supportDeclaration}">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">联合发起宣言<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <input type="text" name="representDeclaration" lay-verify="represent_xy" autocomplete="off"
                                   placeholder="联合发起宣言" class="layui-input" value="${activity.representDeclaration}">
                        </div>
                    </div>--%>

                    <div class="layui-form-item">
                        <label class="layui-form-label">活动详情<span class="f-verify-red">*</span></label>
                        <div class="layui-input-block">
                            <script id="ueditor1" type="text/plain"></script>
                            <div style="display: none" id="contentView">${activityDetail.content}</div>
                            <input type="hidden" name="content" id="content" lay-verify="content"
                                   data-link-ue="ueditor1"/>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <div class="layui-input-block">
                            <a href="javascript:void(0)" class="layui-btn layui-btn-danger" lay-submit lay-filter="*">立即提交</a>
                            <a href="javascript:void(0)"
                               class="layui-btn layui-btn-primary">取消</a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <c:if test="${copartner == true}">
            <!--底部-->
            <%@include file="../include/footer.jsp" %>
        </c:if>
    </section>
</div>

<!--底部-->
<%@include file="../include/editFooter.jsp" %>
<script type="text/javascript" src="${ctxStatic}/UEditor/ueditor.config.js"></script>
<script type="text/javascript" src="${ctxStatic}/UEditor/ueditor.all.js"></script>
<script type="text/javascript" src="${ctxStatic}/UEditor/myplugin/uploadCI.js"></script>
<script type="text/javascript" src="${ctxStatic}/UEditor/myplugin/uploadVideo.js"></script>
<!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
<script type="text/javascript" src="${ctxStatic}/UEditor/lang/zh-cn/zh-cn.js"></script>
<script>
    if (${copartner}) {
        txz.initHeader({
            nav:[{
                name: '已参与的众筹项目',
                href:'${ctx}/activity/zcActivity/zcActivityCopartnerList.do'
            },{
                name: '编辑众筹项目',
                curr: true
            }],
            btns:[{
                type:'back'
            }]
        });
    } else {
        $(".aside-main").css("display", "none!important");
    }

    var ue = UE.getEditor('ueditor1', {
        initialFrameWidth : 900,
        initialFrameHeight: 500
    });

    var form, laydate;

    function verify(value, title) {
        if (value == "") {
            return "请填写" + title;
        }
    }

    $(function () {
        layui.use(['form', 'laydate'], function () {
            form = layui.form, laydate = layui.laydate;

            //自定义验证规则
            form.verify({
                title: function (value) {
                    return verify(value, "活动标题");
                },
                crowd_xy: function (value) {
                    return verify(value, "众筹宣言");
                },
                support_xy: function (value) {
                    return verify(value, "支持宣言");
                },
                represent_xy: function (value) {
                    return verify(value, "联合发起宣言");
                },
                publisher: function (value) {
                    if (value == "") {
                        return "请填写发布者";
                    }
                },
                publisherLogo: function (value) {
                    if (value == "") {
                        return "请上传发布者头像";
                    }
                },
                pic: function (value) {
                    if (value == "") {
                        return "请上传活动海报";
                    }
                },
                content: function (value) {
                    $("#contentView").html(ue.getContent());
                    var content = $("#contentView").html();
                    if (content == "") {
                        return "请填写活动详情";
                    }
                }
            });

            //监听提交
            form.on('submit', function (data) {
                //loading层
                var loadIndex = layer.load(1, {
                    shade: [0.1, '#fff'] //0.1透明度的白色背景
                });
                $(data.elem).removeAttr("lay-submit");
                $("#content").val(ue.getContent().replace(/&quot;/gi, ""));
                var action = $("#myForm").attr("action");
                $.post(action, $('#myForm').serialize(), function (res) {
                    $(data.elem).attr("lay-submit", "*");
                    if (res.success) {
                        util.layerMsgSuccess("提交成功", function () {
                            if (${copartner}) {
                                location.href="${ctx}/activity/zcActivity/zcActivityCopartnerList.do";
                            } else {
                                $.get("${ctx}/activity/activity/getDetailQrCode.do", {"activityId": '${activity.id}'}, function (res) {
                                    layer.close(loadIndex);
                                    if (res.success) {
                                        txz.openQrDialog({
                                            title: '扫码二维码可预览分享',
                                            detailList: [{
                                                title: '详情二维码',
                                                url: res.data,
                                                link: ''
                                            }]
                                        })
                                    } else {
                                        util.layerMsgError("获取二维码异常");
                                    }
                                });
                            }
                        });
                    } else {
                        layer.close(loadIndex);
                        $(data.elem).attr("lay-submit","");
                        util.layerMsgError("提交失败")
                    }
                });
            });
            form.render('radio');
        });
        ue.addListener('ready', function () {
            this.setHeight(500);
            if ($("#contentView").html() != "") {
                this.setHeight(850);
            }
            this.setContent($("#contentView").html());
        });
        ue.addListener('blur', function () {
            $("#contentView").html(ue.getContent());
        });
        $('#sel_pic_img').click(function () {
            txz.openSelImg({
                min: 1,
                max: 1,
                info: '建议尺寸：800x450',
                type: '<%=TargetType.ZC_ACTIVITY.getCode()%>',
                cb: function (imgs) {
                    $('#cover-img').css('background-image', 'url(' + imgs[0].path + ')');
                    $('#pic').val(imgs[0].path);
                }
            })
        })
        $('#sel_logo_img').click(function () {
            txz.openSelImg({
                min: 1,
                max: 1,
                info: '建议尺寸：800x450',
                type: '<%=TargetType.ZC_ACTIVITY.getCode()%>',
                cb: function (imgs) {
                    $('#logo-img').css('background-image', 'url(' + imgs[0].path + ')');
                    $('#publisherLogo').val(imgs[0].path);
                }
            })
        })

    })

    // 文本编辑器图片上传
    function uEditorUploadCI(editor) {
        txz.openSelImg({
            min: 1,
            type: '<%=TargetType.ZC_ACTIVITY.getCode()%>',
            cb: function (imgs) {
                if (imgs.length) {
                    for (var i = 0, item; i < imgs.length; i++) {
                        item = imgs[i];
                        editor.focus();
                        editor.execCommand('inserthtml', item.htmlStr);
                    }
                }
            }
        })
    }

    function uEditorUploadCIVideo(editor) {
        txz.openSelVideo({
            min: 1,
            type: '<%=TargetType.ZC_ACTIVITY.getCode()%>',
            cb: function (imgs) {
                if (imgs.length) {
                    for (var i = 0, item; i < imgs.length; i++) {
                        item = imgs[i];
                        editor.focus();
                        editor.execCommand('inserthtml', item.htmlStr);
                    }
                }
            }
        })
    }
</script>
</body>
</html>